
$(function() {
    // 页面加载时加载学生列表
    loadTable();
    // 保存按钮点击事件
    $('#saveButton').click(function() {
        addOrUpdateStudent();
    });

    // 模态框显示时绑定保存按钮点击事件
    $('#myModal').on('show.bs.modal', function() {
        $('#saveButton').off('click').on('click', function() {
            addOrUpdateStudent();
        });
    });
})

//添加或更新学生信息
function addOrUpdateStudent() {
    var id = $("#id").val();  // 获取表单中的 id 值
    // 收集表单数据
    var formData = {
        id: id,  // 包含 id 字段以便后端区分新增和修改操作
        no: $("#no").val(),
        name: $("#name").val(),
        password: $("#password").val(),
        sex: $("#sex").val(),
        age: $("#age").val(),
        score: $("#score").val()
    };
    // 根据是否有 id 值决定是新增还是更新操作
    var url = id ? "/api/student/update" : "/api/student/insert";
    var type = id ? "PUT" : "POST";
    // 发送 AJAX 请求
    $.ajax({
        url: url,
        type: type,
        data: JSON.stringify(formData),
        contentType: "application/json; charset=UTF-8",
        success: function(response) {
            console.log("操作成功: ", response);
            loadTable(); //加载学生信息
            $('#myModal').modal('hide'); //模态框隐藏
            resetForm();  //重置表单
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.error("操作失败: ", textStatus, errorThrown);
            console.error("响应: ", jqXHR.responseText);
        }
    });
}
//加载学生信息
function loadTable() {
    // 发起 AJAX 请求加载学生列表
    $.ajax({
        url: "/api/student/list",
        type: "GET",
        success: function(data) {
            console.log("学生列表加载成功: ", data);
            // 构建学生列表的 HTML
            var html = "";
            data.forEach(function(item) {
                html += '<tr>';
                html += '<td>' + item.id + '</td>';
                html += '<td>' + item.no + '</td>';
                html += '<td>' + item.name + '</td>';
                html += '<td>' + (item.sex === 1 ? '男' : '女') + '</td>';
                html += '<td>' + item.age + '</td>';
                html += '<td>' + item.score + '</td>';
                html += '<td><a href="#" onclick="editStudent(' + item.id + ');">编辑</a> | <a href="#" onclick="delStudent(' + item.id + ');">删除</a></td>'; // 分别添加编辑和删除链接
                html += '</tr>';
            });
            $("#students").html(html);// 更新表格内容
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.error("加载学生列表失败: ", textStatus, errorThrown);
        }
    });
}
//编辑学生信息
function editStudent(id) {
    $.ajax({
        url: "/api/student/get/" + id,
        type: "GET",
        success: function(data) {
            $("#id").val(data.id);  // 设置表单中的 id 字段
            $("#no").val(data.no);
            $("#name").val(data.name);
            $("#password").val("");  // 密码字段留空，防止显示
            $("#sex").val(data.sex);
            $("#age").val(data.age);
            $("#score").val(data.score);
            $('#myModal').modal('show');// 显示模态框
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.error("加载学生信息失败: ", textStatus, errorThrown);
        }
    });
}
//重置表单
function resetForm() {
    $("#id").val("");  // 重置 id 字段
    $("#no").val("");
    $("#name").val("");
    $("#password").val("");
    $("#sex").val("");
    $("#age").val("");
    $("#score").val("");
}
//删除学生信息
function delStudent(id) {
    if (confirm("确定要删除这条记录吗？")) {
        $.ajax({
            url: "/api/student/deletebyid/" +id,
            type: "DELETE",
            success: function(response) {
                console.log("删除成功: ", response);
                loadTable(); //加载学生信息
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error("删除失败: ", textStatus, errorThrown);
                console.error("响应: ", jqXHR.responseText);
            }
        });
    }
}

//搜索学生
function searchStudents() {
    var queryNo = $("#queryNo").val();
    var queryName = $("#queryName").val();
    var querySex = $("#querySex").val();
    var queryAgeRange = $("#queryAgeRange").val();
    var queryScoreRange = $("#queryScoreRange").val();

    var queryParams = {};
    if (queryNo !== "") queryParams.no = queryNo;
    if (queryName !== "") queryParams.name = queryName;
    if (querySex !== "") queryParams.sex = querySex;
    if (queryAgeRange !== "") queryParams.ageRange = queryAgeRange;
    if (queryScoreRange !== "") queryParams.scoreRange = queryScoreRange;

    $.ajax({
        url: "/api/student/search",
        type: "GET",
        data: queryParams,
        success: function(data) {
            console.log("查询成功: ", data);
            updateTable(data);// 更新表格内容
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.error("查询失败: ", textStatus, errorThrown);
        }
    });
}
//更新表格
function updateTable(data) {
    var html = "";
    data.forEach(function(item) {
        html += '<tr>';
        html += '<td>' + item.id + '</td>';
        html += '<td>' + item.no + '</td>';
        html += '<td>' + item.name + '</td>';
        html += '<td>' + (item.sex === 1 ? '男' : '女') + '</td>';
        html += '<td>' + item.age + '</td>';
        html += '<td>' + item.score + '</td>';
        html += '<td><a href="#" onclick="editStudent(' + item.id + ');">编辑</a> | <a href="#" onclick="delStudent(' + item.id + ');">删除</a></td>';
        html += '</tr>';
    });
    $("#students").html(html);
}
